import { saveCuesTopicTreeAssignOrganization } from '@/services/api/api-cues-topic';
import { CloseOutlined, FolderOutlined, HomeOutlined } from '@ant-design/icons';
import { DrawerForm } from '@ant-design/pro-form';
import { Empty, Tree } from 'antd';
import { DataNode } from 'antd/es/tree';
import 'dayjs/locale/zh-cn';
import React, { useEffect, useState } from 'react';

interface AddTopicAssignOrganizationProps {
  onRefurbish: () => void;
}

const AddTopicAssignOrganization: React.FC<AddTopicAssignOrganizationProps> = ({ onRefurbish }) => {
  /**
   * 初始化树形数据
   */
  const [treeOrganizationData, setTreeOrganizationDataState] = useState<DataNode[]>();
  /**
   * 树形列表选择数据
   */
  const [checkedOrganizationIds, setCheckedOrganizationIdsState] = useState<any>();
  /**
   * 预备Tree结构数据
   * @param data
   */
  function readyTreeData(data: AdminOrganizationData.Organization[]): any {
    const treeData = new Array();
    if (data) {
      data.forEach((val) => {
        treeData.push({
          title: val.name,
          key: val.id,
          item: val,
          children: readyTreeData(val.children as AdminOrganizationData.Organization[]),
          icon:
            val.state === 1 ? (
              val.isFolder === 0 ? (
                <HomeOutlined />
              ) : (
                <FolderOutlined />
              )
            ) : (
              <CloseOutlined />
            ),
        });
      });
    }
    return treeData;
  }

  /**
   * 加载权限详情
   * @param key
   */
  const loadOrganizationData = async () => {
    try {
      const response = await saveCuesTopicTreeAssignOrganization();
      if (response.code === 0) {
        const treeData = new Array<DataNode>();
        treeData.push({
          title: '融媒通',
          key: '0',
          item: { id: '0', name: '融媒通' },
          children: readyTreeData(response.data),
        });
        setTreeOrganizationDataState(treeData);
      }
    } catch (error) { }
  };

  /**
   * 加载权限树请求网络
   */
  useEffect(() => {
    loadOrganizationData();
  }, []);

  return (
    <DrawerForm
      width="500px"
      title="报送范围：自定义（多选）"
      trigger={<a key="activeSaveAssign">点击添加</a>}
      autoFocusFirstInput
      drawerProps={{
        destroyOnClose: true,
      }}
      onVisibleChange={(visible: boolean) => {
        if (visible) {
        }
      }}
      submitter={false}
    >
      {treeOrganizationData && treeOrganizationData.length ? (
        <Tree
          defaultExpandAll
          showLine={{ showLeafIcon: false }}
          showIcon={true}
          treeData={treeOrganizationData}
          checkedKeys={checkedOrganizationIds}
          checkable
          onCheck={(checkedKeys, e) => {
            const checkKeys = new Array();

            e.checkedNodesPositions?.map((item) => {
              if (item.pos.length >= 5) {
                checkKeys.push(item.node.key);
              }
              return item;
            });

            setCheckedOrganizationIdsState(checkedKeys);
          }}
        />
      ) : (
        <Empty />
      )}
    </DrawerForm>
  );
};
export default AddTopicAssignOrganization;
